import './App.css';
import { Routes, Route, useLocation, useNavigate } from "react-router-dom"
import Register from './pages/register'
import Layout from './pages/components/layout'
import Project from './pages/project'
import Kanban from './pages/kanban'
import Epic from './pages/epic'
import Login from './pages/login'
import EventBus from './util/event'
import { Button, Divider, notification, Space } from 'antd';
import { useEffect } from 'react';
import { getOrgsAsync, getProjectListAsync, getTaskTypesAsync, getUsersAsync } from './redux/slice/project';
import { useDispatch } from 'react-redux';

function App() {
    const dispatch = useDispatch()
    const [api, contextHolder] = notification.useNotification();
    const location = useLocation()
    const navigate = useNavigate()
    // console.log('location', location)

    const openNotification = (msg) => {
        api.error({
            message: msg,
            placement: 'topRight'
        });
    };
    
    useEffect(() => {

        if(location.pathname === '/') {
            navigate('/project')
        }

        dispatch(getUsersAsync())
        dispatch(getOrgsAsync())
        dispatch(getTaskTypesAsync())
        dispatch(getProjectListAsync())

        // 没有登录
        EventBus.on("global_not_login", function (msg) {
            navigate('/login')
        })

        EventBus.on("global_error_tips", function (msg) {
            // console.log('发生错误了')
            openNotification(msg)
        })
    }, [])

    return ( 
        <div className="App">
            {contextHolder}
            <Routes>
                <Route element={<Layout />}>
                    <Route path='/project' element={<Project />}></Route>
                    <Route path='/project/:id/kanban' element={<Kanban />}></Route>
                    <Route path='/project/:id/epic' element={<Epic />}></Route>
                </Route>
                <Route path='/login' element={<Login />} />
                <Route path='/register' element={<Register />} />
            </Routes>
        </div>
    );
}

export default App;